$(function () {
    var layer = layui.layer
    /* 1--获取所有的分类信息，渲染到页面 */
    initCateList();

    function initCateList() {
        $.ajax({
            method: 'get',
            url: '/my/article/cates',
            success: function (res) {
                if (res.status !== 0) {
                    return layer.msg(res.message, {
                        icon: 5
                    })
                };
                // console.log(res);
                // 渲染到页面
                var htmlStr = template('tpl-cate', res);
                $("tbody").html(htmlStr)
            }
        })
    };
    /* 2--添加类别 */
    //2.1点击添加类别弹出模态框
    var indexAdd = null;
    $("#btnAddCate").on('click', function () {
        indexAdd = layer.open({
            type: 1, //1为页面层
            title: '添加分类',
            area: ['500px', '300px'], //设置大小
            content: $("#dialog-add").html() //设置内容
        });
    });
    // 2.2给添加表单注册submit事件--动态渲染的要用（事件委托）
    $('body').on('submit', "#form-add", function (e) {
        e.preventDefault();
        var data = $(this).serialize();
        // console.log(data);
        $.ajax({
            method: 'post',
            url: '/my/article/addcates',
            data: data,
            success: function (res) {
                // console.log(res);
                if (res.status !== 0) {
                    return layer.msg(res.message, {
                        icon: 5
                    })
                };
                layer.msg(res.message, {
                    icon: 6
                });
                // 重新渲染分类列表
                initCateList();
                // 关闭模态框
                layer.close(indexAdd);
            }
        })
    });
    /* 3---编辑分类 */
    // 3.1单击编辑按钮，弹出模态框
    var indexEdit = null;
    $('tbody').on('click', '.btn-edit', function () {
        indexEdit = layer.open({
            type: 1,
            title: '编辑分类',
            area: ['500px', '300px'],
            content: $('#dialog-edit').html()
        });
        // 获取被编辑分类的id---自定义id值
        var id = $(this).attr('data-id');
        // console.log(id);
        /* get请求的参数
               查询字符串：http：----？id=20
               动态参数：http-------/20（参数是一部分）
        */
        $.ajax({
            method: 'get',
            url: '/my/article/cates/' + id,
            success: function (res) {
                if (res.status !== 0) {
                    return layer.msg(res.message, {
                        icon: 5
                    })
                };
                // 把数据渲染到表单中
                layui.form.val('form-edit', res.data)
            }
        })
    });
    // 3.2实习编辑功能
    $('body').on('submit', '#form-edit', function (e) {
        e.preventDefault();
        var data = $(this).serialize();
        $.ajax({
            method: 'post',
            url: '/my/article/updatecate',
            data: data,
            success: function (res) {
                if (res.status !== 0) {
                    return layer.msg(res.message, {
                        icon: 5
                    })
                };
                layer.msg(res.message, {
                    icon: 6
                });
                // 重新渲染分类
                initCateList();
                // 关闭模态框
                layer.close(indexEdit)
            }
        })
    });
    /* 4---删除分类 */
    $('tbody').on('click', '.btn-delete', function () {
        // 获取id值
        var id = $(this).siblings().attr('data-id');
        layer.confirm('确认要删除吗?', {
            icon: 3,
            title: '提示'
        }, function (index) {
            //do something
            // 发送ajax
            $.ajax({
                method: 'get',
                url: '/my/article/deletecate/' + id,
                success: function (res) {
                    if (res.status !== 0) {
                        return layer.msg(res.message, {
                            icon: 5
                        })
                    };
                    layer.msg(res.message, {
                        icon: 6
                    });
                    // 重新渲染分类
                    initCateList();
                }

            })


            layer.close(index);
        });
    })
})